<div class="layui-tab layui-tab-card" lay-filter="customer">
    <!--搜索框-->
    <div class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="layadmin-useradmin-formlist">
        <div class="layui-form-item">
            <div class="layui-inline">
                <input type="text" name="info" placeholder="用户名/手机号" autocomplete="off" class="layui-input" value="">
            </div>
            <div class="layui-inline">
                <button class="layui-btn layuiadmin-btn-admin layui-btn-primary" lay-submit lay-filter="LAY-user-back-search">
                    <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i> 搜索
                </button>
            </div>
            {if check_roles('admin/user/create')}
            <div class="layui-inline">
                <button class="layui-btn top_toolbar layui-btn-primary" data-target="iframe" data-type="add">
                    <i class="icon iconfont icon-tianjia"></i> 添加
                </button>
            </div>
            {/if}
        </div>
    </div>

    <div class="layui-card-body">
        <!--表格-->
        <table id="demo" lay-filter="test"></table>
        <!--行功能-->
        <script type="text/html" id="row_operation">
            {if check_roles('admin/user/edit')}
            <a class="layui-btn layui-btn-normal-outline layui-btn-xs" lay-event="edit">编辑</a>
            {/if}
            {if check_roles('admin/user/delete')}
            {{#  if(d.id == 1){ }}
            <a class="layui-btn layui-btn-disabled layui-btn-xs">删除</a>
            {{#  } else { }}
            <a class="layui-btn layui-btn-danger-outline layui-btn-xs" lay-event="del">删除</a>
            {{#  } }}
            {/if}
            {if check_roles('admin/user/reset')}
            <a class="layui-btn layui-btn-danger-outline layui-btn-xs" lay-event="reset">重置密码</a>
            {/if}
        </script>
    </div>
</div>

<script>
    layui.use('table',function () {
        var table = layui.table,form = layui.form;

        //tab切换
        $('#swith_tab li').on('click',function () {
            var url = $(this).data('url');
            window.location.href =  url;
        });

        //初始化表格
        var tableIns = table.render({
            elem: '#demo'
            // ,height: 'full-300'
            ,url: '/admin/user/index' //数据接口
            ,page: true //开启分页
            ,limit: 15
            ,cols: [[ //表头
                {field: 'name', title: '用户名',align:'center'}
                ,{field: 'mobile', title: '手机号',align:'center'}
                ,{field: 'role_name', title: '权限',align:'center'}
                // ,{field: 'email', title: '邮箱',align:'center'}
                // ,{field: 'region_name', title: '所属区域',align:'center'}
                // ,{field: 'hotel_name', title: '所属空间',align:'center'}
                ,{field: 'type_alias', title: '用户类型',align:'center'}
                ,{field: 'status_alias', title: '状态',align:'center'}
                ,{fixed: 'right', title:'操作', toolbar: '#row_operation', width:250,align:'center'}
            ]]
        });

        //监听搜索
        form.render(null, 'layadmin-useradmin-formlist');
        form.on('submit(LAY-user-back-search)', function(data){
            var field = data.field;
            tableIns.reload({
                where: field
                ,page: {
                        curr: 1 //重新从第 1 页开始
                }
            });
        });

        //监听行工具事件
        table.on('tool(test)', function(obj){
            var data = obj.data;
            console.log(obj);
            if(obj.event === 'del'){
                layer.confirm('确定删除['+data['name']+']？', function(index){
                    $.post("{:url('user/delete')}",{id:data.id},function (ret) {
                        if(ret.code == 0){
                            layui.table.reload('demo');
                            layer.msg(ret.msg,{icon:6,time:1000})
                        }else{
                            layer.msg(ret.msg,{icon:5,time:2000})
                        }
                    });
                    layer.close(index);
                });
            }else if(obj.event === 'reset'){
                layer.confirm('重置后密码为123456，确定重置密码？', function(index){
                    $.post("{:url('user/reset')}",{id:data.id},function (ret) {
                        if(ret.code == 0){
                            layer.msg(ret.msg,{icon:6,time:1000},function () {
                                layui.table.reload('demo');
                            })
                        }else{
                            layer.msg(ret.msg,{icon:5,time:2000})
                        }
                    });
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.open({
                    type: 2
                    ,title: '编辑'
                    ,content: "{:url('user/edit')}?id="+data.id
                    ,shadeClose: true
                    ,shade: 0.4
                    ,area: ['500px', '600px']
                    ,btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        //点击确认触发 iframe 内容中的按钮提交
                        var submit = layero.find('iframe').contents().find("#form-submit");
                        submit.click();
                    }
                });
            }
        });
    });

    //头部功能条
    $('.top_toolbar').on('click', function(){
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });
    //事件对象
    var active = {
        add: function(){
            layer.open({
                type: 2,
                title: '添加',
                shadeClose: true,
                shade: 0.4,
                area: ['500px', '600px'],
                content: '/admin/user/create', //iframe的url
                btn: ['确认', '取消'],
                yes:function(index, layero){
                    //按钮【按钮一】的回调
                    //点击确认触发 iframe 内容中的按钮提交
                    var submit = layero.find('iframe').contents().find("#form-submit");
                    submit.click();
                },
                btn2:function(index,layero){
                    //按钮【按钮二】的回调
                    layer.close(index);
                }
            });
        }
    }
</script>
